// 将px转换为vw的工具包
const pxToViewport = require("postcss-px-to-viewport-8-plugin");
const vw = pxToViewport({
  // 视口宽度，一般就是 375（ 设计稿一般采用二倍稿，宽度为 375 ）
  viewportWidth: 750,
  exclude: [/node_modules/],
});

const webpackBundleAnalyzer =
  require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const isPro = (dev) => dev === "production";

const path = require("path");
const { name } = require("./package.json");

const pathResolve = (pathUrl) => path.join(__dirname, pathUrl);

module.exports = {
  reactScriptsVersion: "react-scripts" /* (default value) */,
  webpack: {
    alias: {
      "@": pathResolve("src"),
      "@assets": pathResolve("src/assets"),
      "@plugin": pathResolve("src/plugin"),
      "@utils": pathResolve("src/utils"),
      "@api": pathResolve("src/api"),
      "@pages": pathResolve("src/pages"),
    },
    // 以下代码！！！  与alias或babel同级

    configure(webpackConfig, { env, paths }) {
      // 修改build的生成文件名称
      if (env === "production") {
        paths.appBuild = "dist";
        webpackConfig.output = {
          ...webpackConfig.output,
          path: path.resolve(__dirname, "dist"),
          publicPath: "./",
        };
      }

      return webpackConfig;
      // if(isPro(env)){
      //   webpackConfig.plugins.push(new webpackBundleAnalyzer());
      // }
      // webpackConfig.externals = {
      //   'react': 'react',
      //   'react-dom': 'react-dom',
      //   'react-keeper': 'react-keeper',
      // }

      // 配置扩展扩展名
      // webpackConfig.resolve.extensions = [...webpackConfig.resolve.extensions, ...['.scss', '.css']];
      // // 接入微前端框架qiankun的配置,不接入微前端可以不需要
      // webpackConfig.output.library = `${name}-[name]`;
      // webpackConfig.output.libraryTarget = 'umd';
      // webpackConfig.output.globalObject = 'window';
      // return webpackConfig;
    },
  },
  style: {
    postcss: {
      mode: "extends",
      loaderOptions: {
        postcssOptions: {
          ident: "postcss",
          plugins: [vw],
        },
      },
    },
  },
  devServer: {
    // 本地服务的响应头设置
    headers: {
      // 允许跨域
      "Access-Control-Allow-Origin": "*",
    },
    proxy: {
      "/api": {
        target: "https://cny.hawnlink.cn",
        changeOrigin: true,
      },
    },
  },
};
